import 'bootstrap/dist/css/bootstrap.css';
import '../css/index2.scss';

require('bootstrap/dist/js/bootstrap.js');
require('./common.js');

$('#sidebar-menu a[href="website_board.html"]').addClass('active')
$('#sidebar-menu a[href="website_board.html"]').parent('li').addClass('active')


 require('./echartsFunction/chartClass.js');


 require('./echartsFunction/tool.js');




import { websiteKeyUrl, websiteLatestUrl } from './urlconfig/config.js'; //获取路径

import {tableInit} from './tableFunction/cmmon.js'; //获取表格渲染

import {chartData} from './lineConfig.js'; //获取多站的线条配置

import {getData, chartError, removeChartError} from './chartFunction.js'; //获取ajax请求返回的结果

var resDataObj = {
	timeData: [],
	seriesData: {}
};
		
var reqOption = {
	data: {
			time: 30,
	    	page_number: 'all'
		},
	url: websiteKeyUrl,
	type: 'post'		
}, chart;


function creat() {
	getData(reqOption).then(function(res){
		
		if(res.hasOwnProperty('items') || res.items.length > 0) {
			removeChartError($("#chart-content"));
			formatResData(res.items);
			chart = new ChartClass($("#chart-content")[0], chartData);
			chart.init();
		}else {
			removeChartError($("#chart-content"));
			chartError($("#chart-content"))
		}
		
	}, function() {
		removeChartError($("#chart-content"));
		chartError($("#chart-content"))
	})
}
creat();
function formatResData(resArr) {
	resDataObj.seriesData = {};
	resDataObj.timeData = [];
	let length = resArr.length;
	let webName = [];
	let xAxisTime = [];
	
	for(let index = 0; index < length; index++) {
		webName[index] = resArr[index].name;
		let obj = {};
		let i = 0, j = 0;
		let seriesData = [];
		let dataValue = resArr[index].data;
		for(var p in dataValue) {
			xAxisTime[j++] = tool.formatDate(parseInt(p));
			seriesData[i++] = dataValue[p];
			resDataObj.seriesData[resArr[index].name] = seriesData;
			
		}
		

	}
	resDataObj.timeData = xAxisTime;
	chartData.name = webName;
	chartData.data = resDataObj;
}		





// 时间选择
function setTime(dagnumber, ele) {
	reqOption.data.time = dagnumber;
	let ele_siblins = tool.sibling(ele);
	for(let index = 0, length = ele_siblins.length; index < length; index++) {
		tool.removeClass(ele_siblins[index], 'btn-default');
	}
	tool.addClass(ele, 'btn-default');
	chartData.day = dagnumber;
	creat()
	
}

// 页数选择
function setPage(page, ele) {
	reqOption.data.page_number = page;
	let ele_siblins = tool.sibling(ele);
	for(let index = 0, length = ele_siblins.length; index < length; index++) {
		tool.removeClass(ele_siblins[index], 'btn-default');
	}
	tool.addClass(ele, 'btn-default');
	chartData.page = page;
	creat();
}


window.setTime = setTime;
window.setPage = setPage;

$.extend(window, {
    statusFormatter: function(value, row) {
    	if(/\-/g.test(value)) {
			return '<div class="label label-table label-danger">'+value+'</div>';
		}else if(/\+/g.test(value)) {
			return '<div class="label label-table label-success">'+value+'</div>';
		}else {

			return '<div class="label label-table btn-primary">'+value+'</div>';
		}
    },
    operateFormatter: function(value, row) {
    	let link = 'website_detail.html?web_name='+row.name;
    	return '<a class="btn btn-default btn-sm" href="'+link+'">查看明细</a>'
    }
});

let reqData = {};
let baseConfig = {
	list: {
		url: websiteLatestUrl,
		type: 'get',
		data: reqData
	},
	table: {
		id: '#datatable-editable',	
		columns: [
			{
                field: 'name',
                title: '站点名称'
            },{
                field: 'all_count',
                title: '总词量'
            },{
                field: 'all_trend',
                title: '环比变化',
                formatter: statusFormatter
            },{
                field: 'page1_count',
                title: '第一页词量',
            },{
            	field: 'page1_trend',
            	title: '环比变化',
            	formatter: statusFormatter
            },{
            	field: 'page2_count',
            	title: '第二页词量'
            },{
            	field: 'page2_trend',
            	title: '环比变化',
            	formatter: statusFormatter
            },{
            	field: 'rise_page1',
            	title: '涨入第一页'
            },{
            	field: 'drop_page2',
            	title: '跌入第二页'
            },{
            	field: 'change',
            	title: '变化',
            	formatter: statusFormatter
            }, {
            	field: 'operate',
            	
            	formatter: operateFormatter
            }
		],
		// actions: [],
		// date_forma: {
		// 	formatter: 'yyyy-MM-dd',
		// 	field: 'create_at'
		// },
	},	
	//分页默认是bootstrap																	
	page: false, //是否需要分页
	// pageOption: {
	// 	id: '#datatable-paginate', 
	// 	visiblePages: 10 //页面展示的分页的按钮数量
	// },
	// detail_action: {		
	// 	url: visitorGroupInfoUrl,
	// 	type: 'post',
	// 	postdata: {
	// 		token: token
	// 	},
	// 	postkey: 'id',
	// 	detail_modal: {
	// 		info_ele: 'span',
	// 		id: '#detail-modal',
	// 		detail_columns: [
	// 			{class: 'name', data_key: 'title'},
	// 			{class: 'desc', data_key: 'content'},
	// 			{class: 'status', data_key: 'status'},
	// 			{class: 'source', data_key: 'datafrom_title'},
	// 			{class: 'label-for', data_key: 'tag_title'}
	// 		]
	// 	}
	// }
};

var table = new tableInit(baseConfig);